<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="UTF-8">
		<title>
			To do 
		</title>
		<link rel="shortcut icon" href="icons/favicon.ico" />
		<link rel="stylesheet" href="css/reset.css"/>
		<link  rel="stylesheet" href="css/main.css">
		<script type="text/javascript" src="script/jquery-min.js">
		</script>
		<script type="text/javascript" src="script/main.js">
		</script>
	</head>
	<body>
	<div class="pageContent">
		<div class="heading"><h2>My To DO List</h2></div>
		<div style="margin:5px 0;padding:5px 0;border-bottom:2px solid whitesmoke;">
			<h3>Create new task:</h3>
			<form name="task" id="task" method="post">
				<input type="text" name="todotask" placeholder="What you want to do?" title="Task" style="width:50%;" autofocus required autocomplete="off">
				<select id="priority" style="width:140px;height:25px;border-radius:6px;margin:0 10px;color:darkslategray;" form="task" title="Priority">
					<option value='' disabled selected style='display:none;'>Select priority</option>
					<option value="Normal">Normal</option>
					<option value="Critical">Critical</option>
				</select>
				<input type="date" name="date" placeholder="Due time" title="Enter due time" autocomplete='off'/>
				<input type="submit" value="Add Task" title="Click to add task"/>
			</form>
		</div>
		<div id="mainContent" style="padding-bottom:10px;">
			<div class="selector">
				<span class="check"  title="Refresh">
					<span></span>
				</span>
				<span class="deleteall"  title="Delete all tasks">
					<span></span>
				</span>
			</div>
			
				<table id="tasklist" class="table">
					<thead class="thead">  
						<tr>
							<th width="3%"></th>
							<th width="60%">Description</th>
							<th>Priority</th>
							<th>Due time</th>
						</tr>
					</thead>
					<tbody class="tbody">
					</tbody>
				</table>
		</div>
		<div id="nodata" style="display:none;">
			 <h1>Hooray!! You don't have any task to do. </h1>
		</div>
		<footer>
			<span>
			Copyright &copy; 2013 <Strong>Fahad</Strong>
			</span> 
			<span style="text-align:right;">
			<a href="http://www.facebook.com/tasleem.fahad" target="blank" title="Facebook">Facebook</a>
			<a href="https://twitter.com/#!/fahadtasleem" class="twitter-follow-button" data-show-count="false" data-lang="en">Follow @Twitter</a>
			
			</span>
			<p>
			<strong>More Apps:</strong>
			</p>
			<ul>
				<li>
					<a href="https://chrome.google.com/webstore/detail/trip-calculator/nbjpdpbcejbdbnmioenabocckihajmel" target="blank">Trip calculator</a>
				</li>
			</ul>
		</footer>
	</div>
	</body>
</html>